<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>x-admin</title>
    <link rel="stylesheet" href="/static/xadmin/lib/layui/css/layui.css">
    <style>
    </style>
    <script>
        /^http(s*):\/\//.test(location.href) || alert('请先部署到 localhost 下再访问');
    </script>
</head>
<body>
<div class="layui-form">
    <table class="layui-table">
        <input type="hidden" id="id" value="{$find.id}">
        <tr>
            <td>
                <label class="layui-form-label">广告标题</label>
            </td>
            <td>
                <div class="layui-input-block">
                    <input type="text" id="title" value="{$find.title}" required  lay-verify="required" placeholder="请输入广告标题" autocomplete="off" class="layui-input">
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <label class="layui-form-label">链接地址</label>
            </td>
            <td>
                <div class="layui-input-block">
                    <input type="text" id="link_url" value="{$find.link_url}" required  lay-verify="required" placeholder="请输入链接地址" autocomplete="off" class="layui-input">
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <label class="layui-form-label">广告图片</label>
            </td>
            <td>
                <div class="layui-input-block">
                    <div class="layui-upload">
                        <button type="button" class="layui-btn" id="test2">图片上传</button>
                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                            预览图：
                            <div class="layui-upload-list" id="demo2"><img src="{$find.images}" alt=""></div>
                        </blockquote>
                        <p id="demoText"></p>
                    </div>
                </div>
            </td>
        </tr>

        <tr>
            <td>
                <label class="layui-form-label">开始时间</label>
            </td>
            <td>
                <div class="layui-input-block">
                    <input type="text" id="start_date" value="{$find.start_date}" required  lay-verify="required" placeholder="请选择开始时间" autocomplete="off" class="layui-input">
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <label class="layui-form-label">结束时间</label>
            </td>
            <td>
                <div class="layui-input-block">
                    <input type="text" id="end_date" value="{$find.end_date}"  required  lay-verify="required" placeholder="请选择结束时间" autocomplete="off" class="layui-input">
                </div>
            </td>
        </tr>

        <tr>
            <td>
                <label class="layui-form-label">广告排序</label>
            </td>
            <td>
                <div class="layui-input-block">
                    <input type="number" id="sort" min="0" value="{$find.sort}" required  lay-verify="required" placeholder="请输入广告位排序" autocomplete="off" class="layui-input">
                </div>
            </td>
        </tr>

        <tr>
            <td>
                <label class="layui-form-label">状态</label>
            </td>
            <td>
                <div class="layui-input-block">
                    <input type="radio" name="status" value="1" title="开启" {if condition="$find.status eq 1 "}checked{/if}>
                    <input type="radio" name="status" value="2" title="关闭" {if condition="$find.status eq 2 "}checked{/if}>
                </div>
            </td>
        </tr>
        <tr>
            <td colspan="2" style="text-align: center">
                <div class="layui-input-block">
                    <button class="layui-btn" onclick="add_sumbit()">立即提交</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </td>
        </tr>
    </table>
</div>
<script src="/static/xadmin/lib/layui/jquery-3.2.1.min.js"></script>
<script src="/static/xadmin/lib/layui/layui.js"></script>
<script>
    layui.config({
        base: '/static/xadmin/' //静态资源所在路径
    });
    layui.use(['laydate','form'], function(){
        var laydate = layui.laydate;
        var table = layui.table;
        var form = layui.form;
        laydate.render({
            elem: '#start_date'
            ,type: 'date' //默认，可不填
        });
        laydate.render({
            elem: '#end_date'
            ,type: 'date' //默认，可不填
        });
    });

    var Arr='';
    layui.use('upload', function(){
        var $ = layui.jquery
            ,upload = layui.upload;
        //多图片上传
        var uploadInst=upload.render({
            elem: '#test2'
            ,url: "{:url('admin/upload/img_save',['type'=>'ads'])}"
//            ,multiple: true
            ,accept:'file'  // 允许上传的文件类型
            ,auto:true // 自动上传
            ,before: function(obj){
                /* //预读本地文件示例，不支持ie8
                 obj.preview(function(index, file, result){
                     $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
                 });*/
            }
            ,done: function(res){
                //上传完毕
                if(res.code==1){
                    $('#demo2').html('<img src="'+ res.url +'"  class="layui-upload-img">')
//                    $('#demo2').attr('data-src', res.url);  //成功返回路径存到数据库
//                    console.log(arr);
                    Arr=res.url;
                    return layer.msg('上传成功',{icon:1});

                }else {
                    return layer.msg('上传失败');
                }

            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });

    });




    //添加
    function add_sumbit() {
        var id=$("#id").val();
        var title=$("#title").val();
        var link_url=$("#link_url").val();
        var start_date=$("#start_date").val();
        var end_date=$("#end_date").val();
        if(start_date>end_date){
            layer.msg("开始时间不能小于结束时间",{icon:2});
            return 0;
        }
        var arr=Arr;
        if(arr==""){
            arr=$("#demo2>img").attr("src");
        }
        var sort=$("#sort").val();
        var status = $('input[name=status]:checked').val();
        $.post(
            "{:url('admin/ads/edit')}",
            {id:id,arr:arr,title:title,link_url:link_url,start_date:start_date,end_date:end_date,status:status,sort:sort},
            function (data) {
                console.log(data);
                if(data.code==1){
                    layer.msg(data.msg,{icon:1});
                    setTimeout(function () {
                        parent.layer.closeAll();
                        parent.location.reload();
                    },1500);
                }else{
                    layer.msg(data.msg,{icon:2});
                }
            });
    }

</script>
</body>
</html>
